<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
		<script src="../assets/flexible/flexible.debug.js"></script>
		<script src="../assets/flexible/flexible_css.debug.js"></script>
		<!--[if lt IE 9]>
	        <script src="../assets/html5shiv.min.js"></script>
			<script src="../assets/respond.min.js"></script>
	    <![endif]-->
		<link rel="stylesheet" href="../assets/font-awesome/4.5.0/css/font-awesome.min.css" />
		<link rel="stylesheet" href="../assets/swiper/css/swiper.min.css" />
		<link rel="stylesheet" href="../assets/swiper/css/animate.min.css"/>
		<link rel="stylesheet" href="../css/word.css" />
		<link rel="stylesheet" href="../css/header.css" />
		<link rel="stylesheet" href="../css/mark.css"/>
		<title>全球购</title>
	</head>

	<body>
		<header class="header">
			<div class="h-left h-back">
				<i class="fa fa-angle-left"></i>
			</div>
			<div class="h-center h-bor">
				<p>全球购</p>
			</div>
			<div class="h-right h-time">
				<dl class="share_open">
					<dt><img src="../images/time-imgs/images/time-imgs_12.png"/></dt>
					<dd><i></i></dd>
				</dl>
			</div>
		</header>
		<main class="main">
			<section class="m_banner">
				<div class="mb_top swiper-container">
					<div class="swiper-wrapper">
						<div class="swiper-slide">
							<a href="#"><img src="../images/word-imgs/word-imgs.png" /></a>
						</div>
					</div>
				</div>
				<div class="mb_bottom">
					<div class="mbb_subbanone">
						<div class="opts">
							<a href="#"><img src="../images/word-imgs/images/word-imgs_03.png" /></a>
						</div>
						<div class="opts">
							<a href="#"><img src="../images/word-imgs/images/word-imgs_05.png" /></a>
						</div>
					</div>
					<div class="mbb_subnavone">
						<dl>
							<dt>
								<img src="../images/word-imgs/images/word-imgs_10.png"/>
							</dt>
							<dd>全部</dd>
						</dl>
						<dl>
							<dt>
								<img src="../images/word-imgs/images/word-imgs_12.png"/>
							</dt>
							<dd>上新</dd>
						</dl>
						<dl>
							<dt>
								<img src="../images/word-imgs/images/word-imgs_15.png"/>
							</dt>
							<dd>基本</dd>
						</dl>
						<dl>
							<dt>
								<img src="../images/word-imgs/images/word-imgs_17.png"/>
							</dt>
							<dd>清仓</dd>
						</dl>
					</div>
					<div class="mbb_subbantwo">
						<a href="#"><img src="../images/word-imgs/images/word-imgs_23.png" /></a>
					</div>
					<div class="mbb_subnavtwo">
						<dl>
							<dt>
								<img src="../images/word-imgs/images/word-imgs_26.png"/>
							</dt>
							<dd>服装</dd>
						</dl>
						<dl>
							<dt>
								<img src="../images/word-imgs/images/word-imgs_28.png"/>
							</dt>
							<dd>包袋</dd>
						</dl>
						<dl>
							<dt>
								<img src="../images/word-imgs/images/word-imgs_32.png"/>
							</dt>
							<dd>鞋靴</dd>
						</dl>
						<dl>
							<dt>
								<img src="../images/word-imgs/images/word-imgs_33.png"/>
							</dt>
							<dd>腕表</dd>
						</dl>
					</div>
				</div>
			</section>
			<section class="selion" id="app">
				<section class="opts" v-for="v in list">
					<div class="o-title">
						<figcaption class="brand_title"><h1>{{v.title}}</h1><i></i></figcaption>
						<div class="t_content">
							<a href="#" v-for="imgs in v.brand"><img :src="imgs.brandImgs"/></a>
						</div>
					</div>
					<div class="list"  v-for="sub in v.shopPrefec">
						<figcaption class="list_title">{{sub.caption}}<span>MORE<i class="fa fa-chevron-circle-right"></i></span></figcaption>
						<div class="list_sel" v-for="opts in sub.select">
							<div class="big_banner">
								<a href="#"><img :src="opts.bigban"/></a>
							</div>
							<div class="sel_o" v-for="shop in opts.shopList">
								<dl>
									<dt><img :src="shop.lisImgs"/></dt>
									<dd>
										<h5>{{shop.listitle}}</h5>
										<p>{{shop.price}}</p>
									</dd>
								</dl>
							</div>
						</div>
					</div>
				</section>
			</section>
			<section class="look">
				<div class="look_top">
					<a href="#"><img src="../images/word-imgs/images/word-imgs03_02.png"/></a>
				</div>
				<div class="look_list">
					
				</div>
			</section>
		</main>
		<section class="mask">
			<div class="share swiper-container">
				<div class="sh_top swiper-wrapper">
					<div class="swiper-slide">
						<dl class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.3s" swiper-animate-delay="0.5s">
							<dt>
								<img src="../images/share-imgs/images/share_imgs_19.png"/>
							</dt>
							<dd>微信好友</dd>
						</dl>
						<dl class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.3s" swiper-animate-delay="0.7s">
							<dt>
								<img src="../images/share-imgs/images/share_imgs_18.png"/>
							</dt>
							<dd>微信朋友圈</dd>
						</dl>
						<dl class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.3s" swiper-animate-delay="0.9s">
							<dt>
								<img src="../images/share-imgs/images/share_imgs_16.png"/>
							</dt>
							<dd>微信收藏</dd>
						</dl>
						<dl class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.3s" swiper-animate-delay="1.1s">
							<dt>
								<img src="../images/share-imgs/images/share_imgs_09.png"/>
							</dt>
							<dd>QQ好友</dd>
						</dl>
						<dl class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.3s" swiper-animate-delay="1.3s">
							<dt>
								<img src="../images/share-imgs/images/share_imgs_07.png"/>
							</dt>
							<dd>新浪微博</dd>
						</dl>
						<dl class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.5s" swiper-animate-delay="1.5s">
							<dt>
								<img src="../images/share-imgs/images/share_imgs_05.png"/>
							</dt>
							<dd>复制链接</dd>
						</dl>
					</div>
				</div>
				<div class="sh_bottom">
					<img src="../images/share-imgs/images/share_imgs_03.png"/>
				</div>
			</div>
		</section>
		<script src="../assets/jquery-3.2.1.min.js"></script>
		<script src="../assets/swiper/js/swiper.jquery.min.js"></script>
		<script src="../assets/swiper/js/swiper.animate1.0.2.min.js"></script>
		<script src="../assets/vue/vue.min.js"></script>
		<script src="../assets/template-web.js"></script>
		<script src="../js/word.js"></script>
		<script type="text/html" id="teplate">
			{{each list v}}
				<div class="temp">
					<div class="temp_top">
						<div class="tt_left">
							<div class="ttl_title">
								<div class="ttlt_left">
									<p>*<span>{{v.time}}</span>|</p>
								</div>
								<div class="ttlt_right">
									<p>{{v.lititle}}</p>
								</div>
							</div>
							<div class="ttl_opts">
								<dl>
									<dt><a href="#"><img src={{v.commodity}}/></a></dt>
									<dd>{{v.pirce}}</dd>
								</dl>
							</div>
						</div>
						<div class="tt_right">
							<a href="#"><img src={{v.lishopImgs}}/></a>
						</div>
					</div>
					<div class="temp_bottom">
						<p><span>{{v.crowd}}</span>{{v.discuss}}</p>
					</div>
				</div>
			{{/each}}
		</script>
	</body>

</html>